<template>
  <div class="header">
    <div class="left">
        <span class="iconfont">&#xe61e;</span>
    </div>
    <div class="center">g</div>
    <router-link to='/city'>
        <div class="right">
            {{this.$store.state.city}}
            <span class="iconfont arrow">&#xe65a;</span>
        </div>
        </router-link>
    </div>
</template>
<script>
export default {

}
</script>
<style lang="stylus" scoped>
    // 想要用@符合前面要加上～
    @import '~@/assets/style/varibles.styl'
    .header
        display flex
        height:.86rem
        background $bgColor
        line-height .86rem
        color #fff
        .left
            width .3rem
            padding 0 .2rem
            text-align center
        .center
            flex 1
            background #fff
            margin-top .12rem
            height .64rem
            border-radius .1rem
        .right
            padding 0 .2rem
            color #fff
            text-align center
            .arrow
               font-size .1rem
</style>
